<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>评论页面作业</title>
		<style>
	.waikuang{
	width: 100%; 
	height: 200px;
	border: 2px solid #a0a0a0;
	}
	xian{
	width: 90%; 
	height: 1px;
	background-color: #a0a0a0; 
	margin: 10px 0; 
	margin: 0 auto; 
	margin-top: 30px;
	}
	.buttn_1{
	width: 30px; 
	height: 30px;
	border: 2px solid #a0a0a0; 
	margin-top: 5px;
	}
	.buttn_2{
	width: 30px; 
	height: 30px;
	border: 2px solid #a0a0a0; 
	margin-top: 5px; 
	margin-left:40px; 
	position: relative; 
	top:-29px;
	}
	.buttn_3{
	width: 30px; 
	height: 30px;
	border: 2px solid #a0a0a0;
	margin-top: 5px; 
	margin-left: 40px; 
	position: relative; 
	top:-29px;
	}
	.buttn_4{
	width: 30px; 
	height: 30px;
	border: 2px solid #a0a0a0; 
	margin-top: 5px; 
	margin-left:40px; 
	position: relative; 
	top:-29px;
	}
	.buttn_5{
	width: 30px; 
	height: 30px;
	border: 2px solid #a0a0a0; 
	margin-top: 5px; 
	margin-left:40px; 
	position: relative; 
	top: -29px;
	}
	.buttn_6{
	width: 30px; 
	height: 30px;
	border: 2px solid #a0a0a0;
	margin-top: 5px; 
	margin-left: 40px; 
	position: relative; 
	top:-29px;
	}
	</style>
	</head>
	<body>
	<div class="waikuang">
	    <div class="xian"></div>
		</div>
	<div class="buttn_1"> <a href=" ">1</a >
	  <div class="buttn_2"> <a href="#">2</a >
	   <div class="buttn_3"> <a href="#">3</a >
	    <div class="buttn_4"> <a href="#">4</a >
	     <div class="buttn_5"> <a href="#">5</a >
	      <div class="buttn_6"> <a href="#">6</a >
	   </div>
	    </div>
	     </div>
	      </div>
	       </div>
	        </div>
	          </body> 
	tm1>
	
	
	
	
	
	
	
	
	
	